<template>
    <div>
        <ul>
            <router-link v-for="e in list" v-bind="{to:'/goods/goodsinfo/'+e.id}">
                <img :src="e.img_url" alt=""/>
                <h4>{{e.title}}</h4>
                <p>
                    {{e.sell_price}}
                </p>
            </router-link>

        </ul>
    </div>
</template>

<script type='es6'>
    export default {
        data(){
            return{
                id:'',
                list:[]
            }
        },
        created(){
            this.getData()
        },
        methods:{
            getData(index){
                var index = index || 1
                var url = "http://vue.studyit.io/api/getgoods?pageindex="+ index
                this.$http.get(url).then(function(data){
                    console.log(data);
                    this.list = data.body.message
                })
            }
        }
    }
</script>

<style scoped>
    ul{
        list-style: none;
        padding:0;
        overflow: hidden;

    }
    ul > a {
        width: 50%;
        box-sizing: border-box;
        border: 1px solid #eeeeee;
        float: left;
        height: 300px;
    }

    img{
        display: block;
        width: 100%;
        height: 200px;
    }
</style>  